// 服务端
const express = require('express')
const Vue = require('vue')
// 创建渲染器
const renderer = require('vue-server-renderer').createRenderer()

// 创建 express 和 vue 实例
const app = express()
const page = new Vue({
    data() {
        return {
            title: 'ssr 变量'
        }
    },
    template: '<div><h1>{{title}}</h1><div>hello vue ssr</div></div>'
})

app.get('/', async (req, res) => {
    try {
        const html = await renderer.renderToString(page)
        console.log(html);
        res.send(html)
    } catch (error) {
        res.status(500).send('服务端错误')
    }
})

// 启动服务
app.listen('8080', () => {
    console.log('服务启动')
})
